<?= $this->Html->script('https://maps.googleapis.com/maps/api/js?sensor=true') ?>

<div id="map"></div>

<h1>Zlatara Celesta</h1>
<p><?= @$settings['address'] ?></p>
<p>tel: <?= @$settings['phone'] ?></p>
<p>radno vreme: <?= @$settings['work_hours'] ?></p>
<p><a href="mailto:<?= @$settings['email'] ?>"><?= @$settings['email'] ?></a></p>

<?= $this->Form->create('Contact', array('url' => '/kontakt/send')) ?>
    <p>Imate pitanje, komentar, sugestiju?</p>

    <p><?= $this->Form->text('name', array(
        'placeholder' => 'Ime i prezime...', 
        'value'       => @$data['name'],
        'required'    => false
    )) ?></p>
    <p><?= $this->Form->text('email', array(
        'placeholder' => 'E-Mail adresa...',
        'value'       => @$data['email'],
        'required'    => false
    )) ?></p>
    <p><?= $this->Form->textarea('message', array(
        'placeholder' => 'Poruka...',
        'value'       => @$data['message'],
        'required'    => false
    )) ?></p>
    
    <?= $this->Form->submit('Pošalji', array('div'=>false)) ?>
    
    <div class="form-errors">
        <?= $this->Form->error('name') ?>
        <?= $this->Form->error('email') ?>
        <?= $this->Form->error('message') ?>
    </div>
    
<?= $this->Form->end() ?>

<script type="text/javascript">
    var pos = new google.maps.LatLng(44.81687, 20.470362);

    function initialize() {
        var mapOptions = {
            center: pos,
            zoom: 16,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            rotateControl: false
        };

        var map = new google.maps.Map(document.getElementById("map"), mapOptions);
        
        var info = new google.maps.InfoWindow({
            content: '<h2>Zlatara Celesta</h2><p>Bul.Despota Stefana 55, 11000 Beograd</p><p>011 322 1595</p>'
        })
        
        var marker = new google.maps.Marker({
            map: map,
            position: pos
        });
        google.maps.event.addListener(marker, 'click', function(){
            info.open(map, marker);
        });
    }
  
    $(function(){
        google.maps.event.addDomListener(window, 'load', initialize);
    });
</script>
